<template>
    <div class="oa-tabbar">
        <van-cell>
            <van-col :class="{'activeMenu':tabStr=='students'}" :span="12" @click="gostudent('students')">
                学生管理
            </van-col>
            <van-col :class="{'activeMenu':tabStr=='messages'}" :span="12" @click="gomessage('messages')">
                消息通知
            </van-col>
        </van-cell>
    </div>
</template>
<script>
export default {
    data(){
        return {
            tabStr:'students'
        }
    },
    methods:{
        gostudent:function(str){
            this.tabStr=str;
            if(location.href.indexOf(str)>-1)return;
            this.$router.push({path:'/students'})
        },
        gomessage:function(str){
            this.tabStr=str;
            if(location.href.indexOf(str)>-1)return;
            this.$router.push({path:'/messages'})
        }
    }
}
</script>
<style>
.oa-tabbar{
    position: fixed;
    bottom:0px;
    left:0px;
    z-index:111;
    width:100%;
    background:#fff;
    border-top:1px solid #ddd;
    box-shadow: #ddd 0px 0px 5px;
}
.oa-tabbar .van-col{
    text-align: center;
}
.oa-tabbar .van-col:first-child{
    border-right:1px solid #ddd;
}
.activeMenu{
    
}
</style>